import { Tabs, TabsProps } from "antd";
import TabOne from "./TabOne";
import TabTwo from "./TabTwo";
import Search from "../app/search/page";
import dynamic from "next/dynamic";


const TreeComponent = dynamic(() => import("./TreeComponent"), {
    ssr: false,
});
  

const newick = "((Human:0.1,Chimpanzee:0.1):0.2,Gorilla:0.3);";

const items: TabsProps["items"] = [
    {
        key: "1",
        label: "Project Introduction",
        children: <TabOne />,
    },
    {
        key: "2",
        label: "Hi-C Bar Chart",
        children: <TabTwo />,
    },
    {
        key: "3",
        label: "Search Database",
        children: <Search />,
    },
    {
        key: "4",
        label: "Phylogenetic Tree",
        children: <TreeComponent />,
    },
];

const HomeTabs: React.FC = () => (
    <Tabs defaultActiveKey="1" items={items} />
);

export default HomeTabs;